<template>
  <div>
    <h1 @click="say">{{myname}}</h1>
    <h1>{{state.hob}}</h1>
    <h1>{{lname}}</h1>
    <!-- 全局指令的使用 -->
    <h1 v-myif="true">显示隐藏</h1>
    <hr>
    <tang-son @sendmsg="getData" :food="food" :car="car"></tang-son>
  </div>
</template>

<script setup>  
// setup语法糖中 导入的子组件直接可以使用
  import tangSon from './tangSon.vue'

  import {ref,reactive,computed} from 'vue'
// vue3的setup语法糖写法  在script书写一个setup
    let myname=ref("小瘪三");
    let state=reactive({hob:"吃饭"})
    let say=()=>{
        alert("出来混要有背景")
     }
     let food=ref('烧烤')
      let car=ref('奔驰')
    let lname=computed(()=>{
      return myname.value+"出来混要有实力"
    })
  // setup语法糖写法 不需要return 了
     let getData=(val)=>{
       console.log(val,'子组件传来的值')
     }
</script> 
